		$(document).ready( function () {
			 // this is unfortunately needed due to a race condition in safari
			 // limit the selector to only what you know will be buttons :)
			$("p").css({
				 'padding' : '3px 20px',
				 'font-size' : '12px',
			});
			
			$("p.makeMeAbutton").styledButton({
			
				'orientation' : 'conr', // one of {alone, left, center, right} default is alone
				
				// action can be specified as a single function to be fired on any click event
				'action' : { 
							'on' :function () {
								alert( "You've turned on the button" );
							},
							'off' : function () {
								alert( "You've turned it off" );
							} 
						},
				
				'display' : 'block', // main element's display css, default is inline-block
				
				'toggle' : true, // is the button togglable, default is false
				
				'role' : 'checkbox', // one of {button, checkbox, select}, default is button. Checkbox/select change some other defaults
				
				'checked' : true, // display as a checked checkbox or not, default is false
				
				// checkbox values, default are on and off
				'checkboxValue' : { 
									'on' : "custom on!",
									'off' : "custom off!" 
								},
				
				'defaultValue' : "foobar", // default value for select, doubles as default for checkboxValue.on if checkbox, default is empty
				
				'name' : 'checkfield', // name to use for hidden input field for checkbox and select so form can submit values
				
				// enable a dropdown menu, default is none
				'dropdown' : {
						'element' : 'ul' // what nested element to use as dropdown, default is ul
						}
						
				'clear' : false // in firefox 2 the buttons have to be floated to work properly, set this to true to have them display in a new line
				
				'border' : 2 // use this if you're using a nonstandard border thicknes
			});
		} );